<script setup>
import { ref, onMounted } from 'vue'
import Banner from '@/components/home/Banner.vue';
import BastList from '@/components/home/BastList.vue';
import Like from '@/components/home/Like.vue';
import Menus from '@/components/home/Menus.vue';
import { getMenus, getLike, getBastList, getBanner } from '@/api/home';

const value = ref('')
const menus = ref([])
const guesslikes = ref([])
const bastList = ref([])
const bannerList = ref([])

const getData = () => {
  getMenus().then(res => {
    menus.value = res.data
  })
  getLike().then(res => {
    guesslikes.value = res.data
  })
  getBastList().then(res => {
    bastList.value = res.data
  })
  getBanner().then(res => {
    bannerList.value = res.data
  })
};

onMounted(() => {
  getData();
});
</script>

<template>
  <header>
    <!-- 搜索框 -->
    <van-sticky :offset-top="0">
      <van-search background="#fff" shape="round" placeholder="请输入搜索关键词" />
    </van-sticky>
  </header>
  <main>
    <banner :list="bannerList" />
    <menus :list="menus" />
    <bast-list :list="bastList" />
    <like :list="guesslikes" />
  </main>
</template>
